<template>
   <!-- 表格数据 -->
   <InnerPageTable ref="listTable" :config="pageTableConfig" height="280"></InnerPageTable>
</template>

<script>
import {paymentColumns} from '../../js/quality-table'
   export default {
      props:{
         tableData:{
            type:Array,
            default:() => []
         },
         buName:{
            type:String,
            default:""
         }
      },
      data () {
         return {
            pageTableConfig: {
               loadDataFn: this.getTableList,
               columns: paymentColumns.bind(this)(this.buName),
               autoFirst: false,
               border:true,
               isPage:false,
               initParam: {
                  "buName": "",
                  "perfRollRepRate": "",
                  "payRollRepRate": ""
               },
               allSelection: []
            },
            tableList:[]
         }
      },

      methods: {
         getTableList(tableObj) {
            const {responseProcess} = tableObj;
            if(this.tableList?.length && this.tableList?.length < 5){
               const len = this.tableList.length;
               for(let i = len; i < 5;i++){
                  this.tableList.push({
					 isEmpty:true,
                     buName:"",
                     perfRollRepRate:"",
                     payRollRepRate:""
                  })
               }
            }
            const data = { records: this.tableData || [] }
            responseProcess(data);
         },
      },

      watch:{
         tableData:{
            handler(newVal) {
               this.tableList = newVal || [];
               this.$refs.listTable.load();
            },
            deep: true
         }
      }
   }
</script>
<style lang="less" scoped>
  .app-container{
    display: flex;
    justify-content: space-between;
  }
  
</style>
